<!DOCTYPE html>
<!-- 乐器类型后台页面 -->
<html>
<head>
  <meta charset="utf-8">
  <title>乐器类型后台</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 
  <link rel="stylesheet" href="../../res/css/wholesale/font.css">
  <link rel="stylesheet" href="../../res/css/wholesale/xadmin.css">
  <link rel="stylesheet" href="../../res/layui/css/layui.css">
  <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  <script type="text/javascript" src="../../res/layui/layui.js" charset="utf-8"></script>
  <script type="text/javascript" src="../../res/js/wholesale/xadmin.js"></script>
</head>
<body>
<div class="demoTable" style="margin-top: 10px;">
 
    <div class="x-body">
      <div class="layui-row">
        <div class="layui-form layui-col-md12 x-so">
          <input type="text" name="id" id="demoReload" placeholder="请输入乐器类型" autocomplete="off" class="layui-input">
          <button class="layui-btn" data-type="reload" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
        </div>
      </div>
      <xblock>
        <button class="layui-btn" id="insert"><i class="layui-icon"></i>添加</button>
      </xblock>
<table class="layui-table" lay-data="{url:'../../listenMusicalType/selectAll.action', page:true, id:'idTest'}" lay-filter="demo">
  <thead>
    <tr>
      <th lay-data="{field:'mtId', sort: true, align:'center',style='display:none'}">乐器类型ID</th>
      <th lay-data="{field:'mtName', align:'center'}">乐器类型名称</th>
      <th lay-data="{field:'time', align:'center'}">操作时间</th>
      <th lay-data="{field:'oper', align:'center'}">操作人</th>
      <th lay-data="{field: 'right', align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
  </thead>
</table>
 </div>
 </div>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="textml" id="imgTpl">
    		<img style="width:300px;height:50px;" onmouseover="getPathOver(this)" alt="暂无图片" onmouseout="getPathOut()" src="../../{{ d.userPicture }}">
		</script>

<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
layui.use('table', function(){
  var table = layui.table;
  //监听表格复选框选择
  table.on('checkbox(demo)', function(obj){
    console.log(obj)
  });
  //监听工具条
  table.on('tool(demo)', function(obj){
    var da = obj.data;
    //删除
    if(obj.event === 'del'){
      layer.confirm('确认删除吗?', function(index){
    	layer.close(index);
        obj.del();
        var url="../../listenMusicalType/delecti.action";
        var data={"id":da.mtId};
        $.post(url,data,function(mes){
        	if(mes.datas==1){
        		layer.msg(mes.msg);
        	}else{
        		layer.msg(mes.msg);
        	}
        },"json");
      });
    //修改
    } else if(obj.event === 'edit'){
    	layer.open({
  		  type: 2, //设置为iframe
  		  area: ['360px', '200px'],
  		  content: ['addorupdate.html', 'no'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
  		  ,success: function(layero, index){
  			var url="../../listenMusicalType/selectID.action";
  	    	var data={"mtId":da.mtId};
  	    	var body = layer.getChildFrame('body', index);
			var iframe = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
  	    	$.post(url,data,function(mes){
  	    		/* alert(mes.userType+"s    s"+mes.userPicture) */
				iframe.$("#mtId").val(mes.mtId);			//会员ID
				iframe.$("#mtName").val(mes.mtName);
				// alert(mes.newPath);
				//调用子页面渲染的方法 刷新
				iframe.load();
  	    	},"json");
  		  }
  	  }); 
    }
  });
 

  
  //表单重载
  var $ = layui.$, active = {
		    reload: function(){
		      var demoReload = $('#demoReload');
		      
		      //执行重载    查询
		      table.reload('idTest', {
		        page: {
		          curr: 1 //重新从第 1 页开始
		        }
		        ,where: {
		          key: {
		            title: demoReload.val()
		          }
		        }
		      });
		    }
		  };
  
  $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
  
  
  
  
  /**
  * 增加
  */
  $('#insert').on('click', function(){
	  layer.open({
		  type: 2, //设置为iframe
		  area: ['360px', '300px'],
		  content: ['addorupdate.html', 'no'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
	  }); 
	          
  });
});
/**
*鼠标进入时
*/
function getPathOver(obj){
	$("#pic").toggle(500);
	$("#pic").attr({"src":obj.src});
	
}
/**
*鼠标退出时
*/
function getPathOut(){
	$("#pic").css({"display":"none"});
}
</script>
</body>
</html>